import React, {Component} from 'react';
import {Button, Input, Row, Table, Icon} from 'antd';
import {storage} from "../value";
import app from '../AppMethod';
import moment from 'moment';
import {config} from "../config";

import {FinishStorages} from '../components/EditComponent';
import "../css/roleAssignment.css";

class CheckOrderDetail extends Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false,
            data: [],
            id: '',
            storage_money: '',
        }
    };

    columns = [
        {
            title: '商品名',
            dataIndex: 'storage_detail_goods_name',
            align: 'center'
        },
        {
            title: '件数量',
            dataIndex: 'storage_detail_package',
            align: 'center'
        },
        {
            title: '件数量操作',
            dataIndex: this.columns,
            align: 'center',
            render: data => {
                return (
                    <span>
                        <Button type="default" style={{display: 'inline-block', marginRight: '15px'}} size="small"
                                onClick={() => this.handlePlusJs(data.storage_detail_id)}>
                            <Icon type="plus"></Icon>
                        </Button>
                        <Input style={{display: 'inline-block', width: '100px', height: '24px', textAlign: 'center'}}
                               value={data.storage_detail_real_package}
                               onChange={(e) => this.handleChange(e, data.storage_detail_id)}/>
                        <Button type="default" style={{display: 'inline-block', marginLeft: '15px'}} size="small"
                                onClick={() => this.handleMinusJs(data.storage_detail_id)}>
                            <Icon type="minus"></Icon>
                        </Button>
                    </span>
                )
            }
        },
        {
            title: '散包数',
            dataIndex: 'storage_detail_single',
            align: 'center'
        },
        {
            title: '散包数操作',
            dataIndex: this.columns,
            align: 'center',
            render: data => {
                return (
                    <span>
                        <Button type="default" style={{display: 'inline-block', marginRight: '15px'}} size="small"
                                onClick={() => this.handlePlusSs(data.storage_detail_id)}>
                            <Icon type="plus"></Icon>
                        </Button>
                        <Input style={{display: 'inline-block', width: '100px', height: '24px', textAlign: 'center'}}
                               value={data.storage_detail_real_single}
                               onChange={(e) => this.handleChange1(e, data.storage_detail_id)}/>
                        <Button type="default" style={{display: 'inline-block', marginLeft: '15px'}} size="small"
                                onClick={() => this.handleMinusSs(data.storage_detail_id)}>
                            <Icon type="minus"></Icon>
                        </Button>
                    </span>
                )
            }
        }
    ];

    render() {
        return (
            <div style={{background: '#fff', paddingBottom: '60px'}}>
                <div style={{background: '#fff'}}>
                    <div className="checkOrderDetailTitle">入库详情<FinishStorages
                        handleFinish={(values) => this.handleFinish(values)} storage_money={this.state.storage_money}
                        data={this.state.data}/></div>
                </div>
                <div style={{background: '#fff',paddingTop:60}}>
                    <Row>
                        <Table
                            columns={this.columns}
                            rowKey={record => record.storage_detail_id}
                            loading={this.state.loading}
                            dataSource={this.state.data}
                            pagination={false}
                        >
                        </Table>
                    </Row>
                </div>
            </div>
        )
    };

    componentDidMount() {
        this.handleGetDetailById();
    };

    componentWillUnmount() {
        this.setState = (count, callback) => {
            return;
        }
    };

    /**
     * 根据id查找商品列表
     */
    handleGetDetailById() {
        let id = this.props.match.params.id;
        this.setState({id});
        app.post(storage.SEARCH_STORAGEDETAIL, {storage_id: id}).then((result) => {
            if (result.code === 1) {
                let storage_money = result.data.storage_money;
                let data = result.data.dataSet;
                this.setState({data, storage_money});
            } else {
                this.setState({data: []});
                app.alert(result.msg);
            }
        })
    }

    /**
     * 增加件数量操作
     * @param id
     */
    handlePlusJs(id) {
        let data = this.state.data;
        for (let i = 0; i < data.length; i++) {
            if (data[i].storage_detail_id == id) {
                data[i].storage_detail_real_package = Number(data[i].storage_detail_real_package) + 1;
            }
        }
        this.setState({data: data});
    };

    /**
     * 减少散数量操作
     * @param id
     */
    handleMinusJs(id) {
        let data = this.state.data;
        for (let i = 0; i < data.length; i++) {
            if (data[i].storage_detail_id == id) {
                let num = Number(data[i].storage_detail_real_package) - 1;
                if (num < 0) {
                    num = 0;
                }
                data[i].storage_detail_real_package = num;
            }
        }
        this.setState({data: data});
    };

    /**
     * 增加散数量操作
     * @param id
     */
    handlePlusSs(id) {
        let data = this.state.data;
        for (let i = 0; i < data.length; i++) {
            if (data[i].storage_detail_id == id) {
                data[i].storage_detail_real_single = Number(data[i].storage_detail_real_single) + 1;
            }
        }
        this.setState({data: data});
    };

    /**
     * 减少散数量操作
     * @param id
     */
    handleMinusSs(id) {
        let data = this.state.data;
        for (let i = 0; i < data.length; i++) {
            if (data[i].storage_detail_id == id) {
                let num = Number(data[i].storage_detail_real_single) - 1;
                if (num < 0) {
                    num = 0;
                }
                data[i].storage_detail_real_single = num;
            }
        }
        this.setState({data: data});
    };

    /**
     * 处理件数量输入框变化事件
     * @param e
     * @param id
     */
    handleChange(e, id) {
        let data = this.state.data;
        for (let i = 0; i < data.length; i++) {
            if (data[i].storage_detail_id == id) {
                data[i].storage_detail_real_package = e.target.value;
            }
        }
        this.setState({data: data});
    };

    /**
     * 处理散数量输入框变化事件
     * @param e
     * @param id
     */
    handleChange1(e, id) {
        let data = this.state.data;
        for (let i = 0; i < data.length; i++) {
            if (data[i].storage_detail_id == id) {
                data[i].storage_detail_real_single = e.target.value;
            }
        }
        this.setState({data: data});
    };

    /**
     * 处理完成操作事件
     * @param values
     */
    handleFinish(values) {
        const _this=this;
        let storage_id = this.state.id;
        let role = app.getData("role");
        let storage_receive = JSON.parse(role[0]);
        let storage_receive_id = storage_receive.employee_id;
        let storage_receive_name = storage_receive.employee_name;
        let storage_unload = JSON.parse(role[1]);
        let storage_unload_id = "";
        let storage_unload_name = "";
        for (let i = 0; i < storage_unload.length; i++) {
            storage_unload_id += storage_unload[i].employee_id + ',';
            storage_unload_name += storage_unload[i].employee_name + ',';
        }
        if (storage_unload_id.length > 0) {
            storage_unload_id = storage_unload_id.substr(0, storage_unload_id.length - 1);
            storage_unload_name = storage_unload_name.substr(0, storage_unload_name.length - 1);
        }
        let detail_list = [];
        let data = this.state.data;
        for (let i = 0; i < data.length; i++) {
            let item = {};
            item.storage_detail_id = data[i].storage_detail_id;
            item.storage_detail_real_package = data[i].storage_detail_real_package;
            item.storage_detail_real_single = data[i].storage_detail_real_single;
            detail_list.push(item);
        }
        let submitData = {
            storage_id: storage_id,
            storage_receive_id: storage_receive_id,
            storage_receive_name: storage_receive_name,
            storage_unload_id: storage_unload_id,
            storage_unload_name: storage_unload_name,
            storage_real_money: values.storage_real_money,
            storage_real_package: values.storage_real_package,
            storage_real_single: values.storage_real_single,
            detail_list: JSON.stringify(detail_list),
        };
        app.post(storage.FINISH_STORAGE, submitData).then((result) => {
            if (result.code === 1) {
                app.alert(result.msg, 'success', 3);
                app.goBack(_this);
            } else {
                app.alert(result.msg, 'error', 3);
            }
        })

    };
};

export default CheckOrderDetail;